<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title><?php echo $art['title'];?>-新闻信息管理系统</title>
  <link rel="stylesheet" href="view/assets/css/bootstrap.min.css">
  <script src="view/assets/js/html5shiv.min.js"></script>
  <script src="view/assets/js/respond.min.js"></script>
</head>
<style>
  *{
    margin: 0;
    padding: 0;
  }
</style>
<script>
  window.onload = function (){
    $('#hidepic').click(function (){
      $('#imgbox').hide(2000);
      $('#showpic').show();
      $('#hidepic').hide();
    })
    $('#showpic').click(function (){
      $('#imgbox').show(2000);
      $('#hidepic').show();
      $('#showpic').hide();
    })
  }
</script>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" style="margin: auto;" href="index.php">新闻信息管理系统</a>
      <a class="navbar-brand" style="margin: auto; font-size: 15px;" href="index.php">首页</a>
      <a class="navbar-brand" style="margin: auto; font-size: 15px;" href="showallarticle.php">文章</a>
      <a class="navbar-brand" style="margin: auto;font-size: 15px;" href="about.php">关于</a>
    </div>
  </div>
</nav>
<!--显示文章标题-->
<div class="jumbotron text-center">
  <div style="margin: 20px;">
    <p><?php echo $art['title']; ?></p>
    <span><time><?php echo date('Y/m/d',$art['pubtime']); ?></time>
      &nbsp&nbsp by <?php echo $art['author'];?> &nbsp&nbsp <span class="label label-primary"><?php echo $art['cat_name'];?></span> &nbsp&nbsp
      <?php foreach($tags as $t) {?>
      <span class="label label-info"><?php echo $t['tag'];?></span>
      <?php }?>
    </span>
  </div>
</div>
<!--主体部分-->
<div class="container">
  <div class="row">
    <div class="col-sm-2">
      <div class="page-header">
        <h4  style="text-align: center;">文章栏目 <small>查看文章分类</small></h4>
      </div>
      <div class="text-center">
        <?php foreach($cats as $c) {?>
        <a class="btn btn-info" style="margin-top: 5px;" type="button" href="index.php?cat_id=<?php echo $c['cat_id']; ?>">
          <span><?php echo $c['cat_name']; ?></span><span class="badge"><?php echo $c['cat_num'];?></span>
        </a><br>
        <?php } ?>
        <div class="alert alert-success" role="alert">最多显示5个栏目<br><a href="showallarticle.php">查看更多</a></div>
      </div>
    </div>
    <div class="col-sm-7">
      <div class="panel panel-default">
        <div class="panel-body">
              <?php if ($art['pic']){ ?>
              <img name="imgbox" id="imgbox" src="./<?php echo $art['pic'];?>" width="100%" height="200px">
              <button name="hidepic" id="hidepic" class="btn btn-primary" style="text-align: center;">隐藏图片</button>
              <button name="showpic" id="showpic" class="btn btn-primary" style="text-align: center;display: none;">显示图片</button>
              <?php }?>
              <h3 class="text-center"><?php echo $art['title'];?></h3>
              <h2><?php echo $art['content']; ?></h2>
        </div>
      </div>
    </div>
<!--    评论部分-->
    <div class="col-sm-3">
      <div class="alert alert-info">评论区</div>
      <div class="alert alert-warning">共有<?php echo $art['comm'];?>条评论</div>
      <div class="panel panel-default">
        <div class="panel-body">
          <?php foreach($comms as $c) {?>
          <img src="view/assets/pic/userimg.png" style="float: left" width="50px;" height="50px;">
          <p><?php echo $c['nick'];?> <span class="badge badge-primary">游客</span><br><?php echo $c['email'];?> <br> <?php echo $c['content'];?></p>
          <?php }?>
        </div>
      </div>
      <div class="panel panel-default">
        <div class="panel-body">
          <?php if(isset($rs) && ($rs == false)) {?>
          <div class="alert alert-danger">
            <strong>留言失败!</strong>
          </div>
          <?php } ?>
          <form action="" method="post" style="text-align: center">
            <input type="text" placeholder="请输入昵称" name="nick" id="nick"><br>
            <input type="text" placeholder="请输入邮箱[可为空]" name="email" id="email"><br>
            <textarea name="content" id="content" cols="30" rows="5" placeholder="评论....."></textarea><br>
            <input type="submit" value="提交" class="btn btn-info">
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="jumbotron text-center" style="margin-bottom:0">
  <p>Copyright © 2020-2021 用于数据库实践</p>
</div>
<script src="view/assets/js/jquery.min.js"></script>
<script src="view/assets/js/bootstrap.min.js"></script>
</body>
</html>
